<template>
  <div class="product-item">
    <div class="tit">
      {{ type }}
    </div>
    <div class="val">
      加工数量：<span>{{ data.prodNum }}</span>
    </div>
    <div class="val">
      加工设备：<span>{{ device }}</span>
    </div>
    <div class="val">
      加工时间：<span>{{ data.gmtStart | timeDate('YYYY-MM-DD HH-mm') }}~{{ data.gmtEnd | timeDate('YYYY-MM-DD HH-mm') }}</span>
    </div>
  </div>
</template>

<script>
export default {
  name: "ProductItem",
  props: {
    data: {
      type: Object,
      default: () => {
        return {};
      },
    }
  },
  data() {
    return {};
  },
  computed: {
    type () {
      let type = this.preData.steelDeviceType.find(item => item.id === this.data.rebarTypeId)
      return type ? type.rebarType : ''
    },
    device () {
      let type = this.preData.steelDevice.find(item => item.id === this.data.rebarDeviceId)
      return type ? type.deviceName : ''
    }
  }
};
</script>

<style lang="scss" scoped>
.product-item {
  padding: 15px;
  border-bottom: 1px solid #f5f5f5;

  .tit {
    color: #333;
    font-size: 16px;
  }
  .val {
    font-size: 14px;
    color: #999;
    margin: 5px 0 0;
    span {
      color: #666;
    }
  }
}
</style>
